我一直在思考，要怎麼讓大家可以看每篇文章都可以獨立跟上實作。因為有些我的朋友其實是完全沒基礎看我的文章的，但寫到中間了，也很難他們看就會知道怎麼開始。

今天的文章可以從我的 github 下載今天的範例開始。畢竟學寫程式最好的方法就是跟著實作，光看不實際下來做是學不會的。

React Native Debugger

昨天簡單的介紹了 Redux 並且實際修改了 註冊 api 讓他使用 Redux串連。我相信各位讀者還是不太知道為什麼要用 Redux，而且也對Redux的概念很模糊。

雖然 DevTool 沒辦法讓你幫你把 Redux 具象化，但可以讓你更清楚整個APP註冊的時候的流程。也更助於debugger。

我們先到官網下載並看一下教學。 https://github.com/jhen0409/react-native-debugger

官網提供兩種方法下載，一種是直接下載，一種是在終端機下載

直接下載

進入下載連結點擊自己電腦的版本下載後解壓縮安裝。

終端機下載

直接在中終端機下指令，但有看 Homebrew的版本。

Homebrew 小於 2.6.0

brew update && brew install --cask react-native-debugger

Homebrew 大於等於 2.6.0

brew install --cask react-native-debugger

接著就可以在APP應用裡面看到 React Native Debugger的圖示

[!NOTE] Dev tool
Redux dev tool 是網頁和 natvie都有的。 操作和介面也都一樣

連接APP

打開Debugger會是長這樣。什麼都沒有，等待APP連線。要怎麼把APP連線上去呢？

安裝 react-native-devesetting

yarn add react-native-devsettings

然後在 App.tsx引入即可使用

import "react-native-devsettings";